<template>
	<view class="usdt-recharge-page">
		<image class="qr-code" :src="generateQRCode(selectedAddress)" mode="aspectFit" />

		<view>

			<view class="network-selection">
				<text>选择主网类型：</text>
				<radio-group v-model="selectedNetwork">
					<label v-for="(network, index) in networkTypes" :key="index">
						<radio :value="network.value" /> {{ network.label }}
					</label>
				</radio-group>
			</view>

			<view class="recharge-address">
				<text>充值地址：</text>
				<text class="address-text">{{ selectedAddress }}</text>
				<button @click="copyAddress">复制地址</button>

			</view>
		</view>
		<view>
			<label>充值至</label>
			<view></view>
		</view>
		<view>
			<label>最少充值数</label>
			<view></view>
		</view>
		<view>
			<label>已存入（交易已启动）</label>
			<view></view>
		</view>
		<view>
			<label>已解锁（提现已启用）</label>
			<view></view>
		</view>
		<view>
			<label>合约信息</label>
			<view></view>
		</view>
		<view></view>
		<view>更多消息</view>

		<view>保存并分享地址</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				networkTypes: [{
						label: 'ETH',
						value: 'ETH'
					},
					{
						label: 'TRON',
						value: 'TRON'
					},
					// 可根据需要添加其他主网类型
				],
				selectedNetwork: 'ETH', // 默认选择的主网类型
				addresses: {
					ETH: '0x1234567890abcdef', // 模拟ETH网络的地址
					TRON: 'TTrb2zS7VFMuoXhexxN5rUp4NjH5dZTVxX', // 模拟TRON网络的地址
					// 可根据需要添加其他主网类型的地址
				}
			};
		},
		computed: {
			selectedAddress() {
				return this.addresses[this.selectedNetwork];
			}
		},
		methods: {
			generateQRCode(address) {
				// 这里可以使用生成二维码的库，根据实际使用的库进行调用生成对应地址的二维码
				// 返回生成的二维码图片地址
				return `https://api.qrserver.com/v1/create-qr-code/?data=${address}&size=200x200`;
			},
			copyAddress() {
				// 调用剪贴板API复制地址到剪贴板
				uni.setClipboardData({
					data: this.selectedAddress,
					success() {
						uni.showToast({
							title: '地址已复制',
							icon: 'none'
						});
					},
					fail() {
						uni.showToast({
							title: '复制失败',
							icon: 'none'
						});
					}
				});
			}
		}
	};
</script>

<style scoped>
	/* 样式可根据实际需求进行调整 */
	.usdt-recharge-page {
		padding: 20px;
	}

	.network-selection {
		margin-bottom: 20px;
	}

	.recharge-address {
		display: flex;
		align-items: center;
		margin-bottom: 20px;
	}

	.address-text {
		flex: 1;
		margin-right: 10px;
	}

	button {
		padding: 8px 16px;
		border-radius: 5px;
	}

	.qr-code {
		width: 100px;
		height: 100px;
	}
</style>